import "package:ct_pa_majordomo/config/roomIcons.dart";
import "package:ct_pa_majordomo/config/theme_vars.dart";
import "package:ct_pa_majordomo/pages/home/widgets/section.dart";
import "package:ct_pa_majordomo/router/keys.dart";
import "package:ct_pa_majordomo/utils/stacker.dart";
import "package:flutter/cupertino.dart";
import "package:flutter/material.dart";

import "../../mine/index.dart";

class Device extends StatelessWidget {
  Device({super.key});

  // final List<String> _config = ["门禁", "智能锁", "智能电表", "网关", "采集器"];
  final List<String> _pages = [
    "/device/entrance-guard", "/device/lock", "/device/electricity-meter", "/device/gateway", "/device/collect",];
  final List _config = [{
    "name": "门禁",
    "pages": Keys.DEVICE_ENTRANCEGUARD,
    "icon": RoomIcons.custom_entrance_guard,
  }, {
    "name": "智能锁",
    "pages": Keys.DEVICE_LOCK,
    "icon": RoomIcons.custom_lock,
  }, {
    "name": "智能电表",
    "pages": Keys.DEVICE_ELECTRICITYMETER,
    "icon": RoomIcons.custom_ammeter,
  }, {
    "name": "网关",
    "pages": Keys.DEVICE_GATEWAY,
    "icon": RoomIcons.custom_gateway,
  }, {
    "name": "采集器",
    "pages": Keys.DEVICE_COLLECT,
    "icon": RoomIcons.custom_collect,
  }];

  @override
  Widget build(BuildContext context) {
    return Section(
      title: "智能设备",
      contentPadding: const EdgeInsets.symmetric(horizontal: 10),
      color: Colors.white,
      // moreAction: GestureDetector(
      //   onTap: () {
      //     Navigator.push(context, CupertinoPageRoute(builder: (context) => const Collect()));
      //   },
      //   child: const Text(
      //     "采集器",
      //     style: TextStyle(fontSize: 14),
      //   ),
      // ),
      child: SizedBox(
        height: 90,
        child: ListView.separated(
          padding: const EdgeInsets.only(top: 1, right: 5, bottom: 3, left: 5),
          itemCount: _config.length,
          scrollDirection: Axis.horizontal,
          itemBuilder: (context, index) {
            return Container(
              width: 80,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(12),
                boxShadow: const [ThemeVars.boxShadow],
                color: ThemeVars.colorPrimaryLight,
              ),
              child: GestureDetector(
                behavior: HitTestBehavior.opaque,
                onTap: () {
                  if (_config[index]["pages"] != null) {
                    Stacker.pushNamed(_config[index]["pages"]);
                  }
                },
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    // const SizedBox(width: 40, height: 40, child: Placeholder()),
                    Container(
                      width: 36,
                      height: 36,
                      decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.all(Radius.circular(8)),
                      ),
                      child: Icon(_config[index]["icon"], size: 24, color: ThemeVars.colorPrimary,),
                    ),
                    const SizedBox(height: 8),
                    Text(_config[index]["name"], style: const TextStyle(fontSize: 14)),
                  ],
                ),
              ),
            );
          },
          separatorBuilder: (context, index) => const SizedBox(width: 15),
        ),
      ),
    );
  }
}
